// set st=4 sw=4 ts=4
/*
 * http://stackoverflow.com/questions/10884378/jquery-mobile-click-on-listview/10884422
 */
var app = {
	i: 0,
	str: "",
	// Application Constructor
	initialize: function() {
		document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
	},

	// deviceready Event Handler
	//
	// Bind any cordova events here. Common events are:
	// 'pause', 'resume', etc.
	onDeviceReady: function() {
		this.receivedEvent('deviceready');
		app.i = 0;
	},

	navnext: function(pagename) {
		$('#dataBuf').text(app.str);
		$(":mobile-pagecontainer").pagecontainer("change", "#" + pagename , {
			transition: "slide"
		});
	},

	// Update DOM on a Received Event
	receivedEvent: function(id) {
		$('#add').on('click', function(e) {
			app.i += 1;
			var time = new Date();
			var li = $("<li><a href='#'>增加" + app.i + "<p>" + time + "</p></a></li>");
			$('#myList').append(li).find("li:last").hide();
			$('#myList').listview('refresh');
			$('#myList').find('li:last').slideDown(300);
		});

		$('#myList').delegate('li', 'click', function() {
			var ul = $(this);
			app.str = ul.text();
			alert(app.str);
			app.navnext("two");

		});

		$('#clean').on('click', function() {
			$('#myList').empty();
			$('#myList').listview('refresh');
		});
	}
};

app.initialize();
